<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<style type="text/css">
		canvas{
			background: #eee;
		}
	</style>
</head>
<body>
<canvas id="qcanvas"></canvas>
<canvas id="qcanvas1"></canvas>

<script type="text/javascript" src="./example/js/Qcanvas.js"></script>
<script type="text/javascript">
	(function(){
		var qcanvas = new Qcanvas(["qcanvas",300,200]);
			qcanvas.load({			
				"person":"./example/img/spirit1.png",
			},function(){
				
					var spiritSource = qcanvas.getSourceByName("person"); 

					qcanvas.qspirit.spirit({
						img:spiritSource,
						row:1,
						column:8,
						framesIndex:[0,0],
						tStart:[0,120],
						tWidth:40,
						tHeight:64,
						isLoop:true,
						during:1,
						degree:30,
						mouseup:function(){
							console.log(this);
							console.log('触发mouseup事件');
						}
					})
						
							
			})


	})();

	(function(){
		var qcanvas = new Qcanvas(["qcanvas1",300,200]);  

		qcanvas.qspirit.spirit({
			// img:spiritSource,
			img:'./example/img/spirit1.png',
			row:1,
			column:8,
			framesIndex:[0,0],
			tStart:[0,120],
			tWidth:40,
			tHeight:64,
			isLoop:true,
			during:1,
			mouseup:function(){
				console.log(this);
				console.log('触发mouseup事件');
			}
		}) 

	})()
</script>
</body>
</html>